<template>
  <div class='m-results_month'>
    <el-form :inline='true'>
      <el-form-item label='选择月份：'>
        <el-date-picker
          v-model="month"
          type="month"
          value-format="timestamp"
          placeholder="选择月份">
        </el-date-picker>
      </el-form-item>
      <el-form-item>
        <el-button type='primary' @click='search'>搜索</el-button>
      </el-form-item>
    </el-form>
    <a-table :data='data' :cols='tableKeys'>
      <!-- <el-table-column align="center" label="操作" width='180' slot='ahead'>
        <template slot-scope="scope">
          <div>
            <el-button size='mini' @click='choose(scope.row.id)'>选择</el-button>
            <el-button size='mini' @click='deleteObj(scope.row.id)'>删除</el-button>
          </div>
        </template>
      </el-table-column> -->
    </a-table>
    <div class='u-pagination'>
      <!-- 分页 -->
      <pagination ref='page' @change='getData' :action='fetchData' :pageSize='20'></pagination>
    </div>
  </div>
</template>

<script>
import { mapMutations } from 'vuex'

export default {
  name: 'm-results_month',

  data() {
    return {
      tableKeys: [
        { prop: 'dept_name', label: '部门', minWidth: '100' },
        { prop: 'staff_name', label: '销售人员', minWidth: '100' },
        { prop: 'base', label: '基础业绩指标', minWidth: '100' },
        { prop: 'aggressive', label: '进取业绩指标', minWidth: '100' },
        { prop: 'current', label: '当前业绩', minWidth: '100' }
      ],
      month: new Date().getTime(),
      data: [],
      ifRequesting: false
    }
  },

  mounted() {
    this.$refs.page.changePage()
  },

  methods: {
    ...mapMutations(['setTabRoutes']),

    routerPush(type, args) {
      // push 到缓存里
      this.setTabRoutes({ type: 'add', obj: { ...this.getRouterInfoAccordingName(type), ...args } })
    },

    async fetchData(aPageNum, aPageSize) {
      const time = new Date(this.month)
      const params = {
        aFirmId: this.aFirmId,
        aPageNum,
        aPageSize
      }
      if (this.month) params.aMonth = time.getMonth() + 1
      if (this.month) params.aYear = time.getFullYear()
      return this.$api.linkGetStaffKpByMonth(params)
    },

    getData(data) {
      this.data = data
    },

    search() {
      this.$refs.page.changePage()
    }
  }
}
</script>

<style lang='less'>

</style>